<!-- 微信菜单管理 -->
<template>
  <div>
    <wx-menu-component v-model="menuData"></wx-menu-component>
    <v-btn @click="submitData" color="primary" :disabled="submitDisabled"><v-icon>sync</v-icon> 提交并更新</v-btn>
    <v-dialog
      v-model="dialog"
      hide-overlay
      persistent
      width="300"
    >
      <v-card
        color="primary"
        dark
      >
        <v-card-text>
          请稍等...
          <v-progress-linear
            indeterminate
            color="white"
            class="mb-0"
          ></v-progress-linear>
        </v-card-text>
      </v-card>
    </v-dialog>
  </div>
</template>

<script>
import * as API from '@/api/admin/wx.js'
import WxMenuComponent from '@/components/Wechat/WxMenuComponent.vue'
export default {
  name: 'WXMenu',
  components: { WxMenuComponent },
  data: function () {
    return {
      menuData: { button: [] },
      dialog: false,
      submitDisabled: true
    }
  },
  created: function () {
    this.fetchData()
  },
  computed: {},
  methods: {
    fetchData: function () {
      this.dialog = true
      API.fetchMenu().then(res => {
        this.menuData = res.data
        this.submitDisabled = false
      }).finally(() => {
        this.dialog = false
      })
    },
    submitData: function () {
      this.dialog = true
      API.updateMenu(this.menuData).then(res => {
        this.dialog = false
        this.$toasted.success(res.data)
      })
    }
  }
}
</script>
